{extend name="layouts/admin" /}
{block name="main"}
<link rel="stylesheet" href="/static/admin/css/index.css">
<script type="text/javascript" src="/static/admin/js/echarts.min.js"></script>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body" style="display: flex;flex-direction: column;">
            <div class="data-container">
                <div class="left-container">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>本学期实时评教数据</span>
                    </div>
                    <div class="eval-div">
                        <div class="eval-item">
                            <span>学生评教</span>
                            <div><span>13</span><span>次</span></div>
                        </div>
                        <div class="eval-item">
                            <span>评价完成率</span>
                            <div><span>13%</span></div>
                        </div>
                        <div class="eval-item">
                            <span>督导巡查</span>
                            <div><span>13</span><span>次</span></div>
                        </div>
                        <div class="eval-item">
                            <span>教师听课</span>
                            <div><span>13</span><span>次</span></div>
                        </div>
                        <div class="eval-item">
                            <span>听课完成率</span>
                            <div><span>13%</span></div>
                        </div>
                        <div class="eval-item">
                            <span>教务巡查</span>
                            <div><span>13</span><span>次</span></div>
                        </div>
                        <div class="eval-item">
                            <span>AI预警数</span>
                            <div><span>13</span><span>次</span></div>
                        </div>
                        <div class="eval-item">
                            <span>预警教师</span>
                            <div><span>13</span><span>人</span></div>
                        </div>
                    </div>
                </div>
                <div class="right-container">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>教学质量评价完成率</span>
                    </div>
                    <div>
                        <div id="evalDoneDiv" style="width: 100%;height: 250px;"></div>
                    </div>
                </div>
            </div>

            <div class="data-container">
                <div class="left-container">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>全校教师综合评分分布</span>
                    </div>
                    <div>
                        <div id="teacherEvalDiv" style="width: 100%;height: 250px;"></div>
                    </div>
                </div>
                <div class="right-container">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>各学院教学质量评价</span>
                    </div>
                    <div>
                        <div id="evalQualityDiv" style="width: 100%;height: 250px;"></div>
                    </div>
                </div>
            </div>

            <div class="data-container">
                <div class="left-container" style="width: 32%;">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>学生评价指标平均得分</span>
                    </div>
                    <div>
                        <div id="stuEvalDiv" style="width: 100%;height: 250px;"></div>
                    </div>
                </div>
                <div class="left-container" style="width: 32%;">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>教师评价指标平均得分</span>
                    </div>
                    <div>
                        <div id="teaEvalDiv" style="width: 100%;height: 300px;"></div>
                    </div>
                </div>
                <div class="left-container" style="width: 32%;">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>督导评价指标平均得分</span>
                    </div>
                    <div>
                        <div id="dudaoEvalDiv" style="width: 100%;height: 300px;"></div>
                    </div>
                </div>
            </div>

            <div class="data-container">
                <div class="right-container">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>学生评教情况-学院</span>
                        <div class="layui-form" style="margin-left: 10px;">
                            <input type="checkbox" lay-skin="primary" lay-filter="evalindex" checked value="1" title="A指标">
                            <input type="checkbox" lay-skin="primary" lay-filter="evalindex" value="1" title="B指标">
                            <input type="checkbox" lay-skin="primary" lay-filter="evalindex" value="1" title="C指标">
                            <input type="checkbox" lay-skin="primary" lay-filter="evalindex" value="1" title="D指标">
                            <input type="checkbox" lay-skin="primary" lay-filter="evalindex" value="1" title="E指标">
                        </div>
                    </div>
                    <div>
                        <div id="stuBySchoolDiv" style="width: 100%;height: 250px;"></div>
                    </div>
                </div>
                <div class="left-container">
                    <div class="title-container">
                        <div class="title-line"></div>
                        <span>异常预警</span>
                    </div>
                    <div class="warn-div">
                        <div class="warn-item">
                            <i class="layui-icon layui-icon-about"></i>
                            <span>【学生评教预警】XX老师的XXX课程在12.3号的教评中 XX指标评分较低，请及时关注！</span>
                        </div>
                        <div class="warn-item">
                            <i class="layui-icon layui-icon-about"></i>
                            <span>【督导巡查预警】XX老师的XXX课程在12.3号的督导巡查中 XX指标评分较低，请及时关注！</span>
                        </div>
                        <div class="warn-item">
                            <i class="layui-icon layui-icon-about"></i>
                            <span>【教务巡查预警】XX老师的XXX课程在12.3号的教务巡查中 XX指标评分较低，请及时关注！</span>
                        </div>
                    </div>
                </div>


            </div>

        </div>
    </div>
</div>
<script>
    layui.use(["form"], function () {
        var form = layui.form;
    })
    let evalDoneDiv = echarts.init(document.getElementById("evalDoneDiv"));
    let teacherEvalDiv = echarts.init(document.getElementById("teacherEvalDiv"));
    let evalQualityDiv = echarts.init(document.getElementById("evalQualityDiv"));
    let stuEvalDiv = echarts.init(document.getElementById("stuEvalDiv"));
    let teaEvalDiv = echarts.init(document.getElementById("teaEvalDiv"));
    let dudaoEvalDiv = echarts.init(document.getElementById("dudaoEvalDiv"));
    let stuBySchoolDiv = echarts.init(document.getElementById("stuBySchoolDiv"));
    evalDoneDiv.setOption({
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['学生评教完成率', '教师听课完成率'],
            x:'right'
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['数字制造', '市政与生态工程', '建筑与环境艺术', '人工智能应用', '城市运营管理']
        },
        yAxis: {
            type: 'value',
            name: '完成率(%)',
        },
        series: [
            {
                name: '学生评教完成率',
                type: 'line',
                stack: 'Total',
                data: [120, 132, 101, 134, 90]
            },
            {
                name: '教师听课完成率',
                type: 'line',
                stack: 'Total',
                data: [220, 182, 191, 234, 290]
            }
        ]
    });

    teacherEvalDiv.setOption({
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'right',
            y:'center'
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        series: [
            {
                name: '',
                type: 'pie',
                radius: '50%',
                center: ['40%', '50%'],
                data: [
                    { value: 1048, name: '90～100分' },
                    { value: 735, name: '80～90分' },
                    { value: 580, name: '70～80分' },
                    { value: 484, name: '0～60分' }
                ],
                labelLine: {
                    show: false
                },
                label:{
                    show:false
                }

            }
        ]
    });
    evalQualityDiv.setOption({
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: ['90～100分', '80～90分','70～80分','0～60分'],
            x:'right',
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['数字制造', '市政与生态工程', '建筑与环境艺术', '人工智能应用', '城市运营管理']
        },
        yAxis: {
            type: 'value',
            name: '人数占比(%)',
        },
        series: [
            {
                name: '90～100分',
                type: 'line',
                stack: 'Total',
                smooth: true,
                data: [120, 132, 101, 134, 90]
            },
            {
                name: '80～90分',
                type: 'line',
                stack: 'Total',
                smooth: true,
                data: [220, 182, 191, 234, 290]
            },{
                name: '70～80分',
                type: 'line',
                stack: 'Total',
                smooth: true,
                data: [120, 132, 101, 134, 90]
            },
            {
                name: '0～60分',
                type: 'line',
                stack: 'Total',
                smooth: true,
                data: [220, 182, 191, 234, 290]
            }
        ]
    });
    stuEvalDiv.setOption({
        radar: {
            splitLine: {
                show: false
            },
            splitArea: {
                show: false
            },
            indicator: [
                { name: '指标1', max: 6500 },
                { name: '指标2', max: 16000 },
                { name: '指标3', max: 30000 },
                { name: '指标4', max: 38000 },
                { name: '指标5', max: 52000 },
                { name: '指标6', max: 16000 },
                { name: '指标7', max: 30000 },
                { name: '指标8', max: 38000 },
                { name: '指标9', max: 52000 },
                { name: '指标10', max: 25000 }
            ]
        },

        series: [
            {
                name: '学生评价指标平均得分',
                type: 'radar',

                data: [
                    {
                        value: [5200, 1100, 21000, 29100,10200, 13100, 12000, 18000, 12000, 14000],
                        name: '学生评价指标平均得分'
                    }
                ]
            }
        ]
    });
    teaEvalDiv.setOption({
        radar: {
            splitLine: {
                show: false
            },
            splitArea: {
                show: false
            },
            indicator: [
                { name: '指标1', max: 6500 },
                { name: '指标2', max: 16000 },
                { name: '指标3', max: 30000 },
                { name: '指标4', max: 38000 },
                { name: '指标5', max: 52000 },
                { name: '指标6', max: 16000 },
                { name: '指标7', max: 30000 },
                { name: '指标8', max: 38000 },
                { name: '指标9', max: 52000 },
                { name: '指标10', max: 25000 }
            ]
        },

        series: [
            {
                name: '教师评价指标平均得分',
                type: 'radar',

                data: [
                    {
                        value: [5200, 1100, 21000, 29100,10200, 13100, 12000, 18000, 12000, 14000],
                        name: '教师评价指标平均得分'
                    }
                ]
            }
        ]
    });
    dudaoEvalDiv.setOption({
        radar: {
            splitLine: {
                show: false
            },
            splitArea: {
                show: false
            },
            indicator: [
                { name: '指标1', max: 6500 },
                { name: '指标2', max: 16000 },
                { name: '指标3', max: 30000 },
                { name: '指标4', max: 38000 },
                { name: '指标5', max: 52000 },
                { name: '指标6', max: 16000 },
                { name: '指标7', max: 30000 },
                { name: '指标8', max: 38000 },
                { name: '指标9', max: 52000 },
                { name: '指标10', max: 25000 }
            ]
        },

        series: [
            {
                name: '督导评价指标平均得分',
                type: 'radar',

                data: [
                    {
                        value: [5200, 1100, 21000, 29100,10200, 13100, 12000, 18000, 12000, 14000],
                        name: '督导评价指标平均得分'
                    }
                ]
            }
        ]
    });
    stuBySchoolDiv.setOption({
        tooltip: {
            trigger: 'axis'
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['A学院', 'B学院', 'C学院', 'D学院', 'E学院', 'F学院', 'G学院', 'H学院', 'I学院', 'J学院']
        },
        yAxis: {
            type: 'value',
            name: '分数',
        },
        series: [
            {
                name: 'A指标',
                type: 'line',
                stack: 'Total',
                smooth: true,
                data: [120, 132, 101, 134, 90,120, 132, 101, 134, 90]
            }
        ]
    });
</script>
{/block}
